<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>前端表单</title>

    <script  language="JavaScript">
        setTimeout(function(){location.reload()},2000); //指定1秒刷新一次
    </script>

    <style>
        body {
	background-color: #FFFFFF;
	font-size: 1.4rem;
        }

        li{
            list-style-type: none;/* 去掉li前的点 */
            float: left;/*将li设置成做浮动，变为联动*/
        }
        a{
            display: block;/*将a变成块状*/
            width: 220px;/*设置块的宽度*/
            height: 50px;/*设置块的长度*/
            font-family: Microsoft Yahei;
            line-height: 50px;/*设置字体在块中的高度*/
            background-color: #2f4f4f;
            margin: 0px 0px;/*块里的高宽通过margin设置*/
            color: #fff;
            text-align: center;/*字体居中*/
            text-decoration: none;/*去掉下划线*/
            font-size: 15px;
        }
        a:hover{
            background-color: #2f6f4f;
        }



        th {
            border: 1px solid black;
        }

        td {
            border: 1px solid black;
        }

    </style>
</head>



<div >
    <ul class=daohang>
        <li><a th:href="@{/}">首页</a></li>
        <li><a th:href="@{/selectList}">所有数据</a ></li>
        <li><a th:href="@{/deleteAll}">清空数据</a ></li>
        <li><a th:href="@{/huabu1}">运行轨迹</a ></li>
        <li><a th:href="@{/PID}">调PID</a ></li>
        <li><a th:href="@{/stop_start}">启动停止</a ></li>
        <li><a th:href="@{/picture1}">散点图1</a ></li>
        <li><a th:href="@{/picture2}">散点图2</a ></li>
    </ul>
</div>

<table>
    <thead>
        <tr>
            <th>group_id</th>
            <th>left_wheel_speed</th>
            <th>right_wheel_speed</th>
            <th>x_acceleration</th>
            <th>y_acceleration</th>
            <th>z_acceleration</th>
            <th>x_gyroscope</th>
            <th>y_gyroscope</th>
            <th>z_gyroscope</th>
            <th>x_magnetometer </th>
            <th>y_magnetometer </th>
            <th>z_magnetometer </th>
            <th>adc1</th>
            <th>adc2</th>
            <th>adc3</th>
            <th>decentering</th>
            <th>aorc</th>
            <th>l_pwm</th>
            <th>r_pwm</th>
            <th>x_unknow</th>
            <th>y_unknow </th>
            <th>z_unknow </th>
            <th>circle</th>
        </tr>
    </thead>




    <tbody>
    <tr th:each="carData:${carDataList}">
        <td th:text="${carData.getGroupId()}"></td>
        <td th:text="${carData.getLeftWheelSpeed()}"></td>
        <td th:text="${carData.getRightWheelSpeed()}"></td>
        <td th:text="${carData.getXAcceleration()}"></td>
        <td th:text="${carData.getYAcceleration()}"></td>
        <td th:text="${carData.getZAcceleration()}"></td>
        <td th:text="${carData.getXGyroscope()}"></td>
        <td th:text="${carData.getYGyroscope()}"></td>
        <td th:text="${carData.getZGyroscope()}"></td>
        <td th:text="${carData.getXMagnetometer()}"></td>
        <td th:text="${carData.getYMagnetometer()}"></td>
        <td th:text="${carData.getZMagnetometer()}"></td>
        <td th:text="${carData.getAdc1()}"></td>
        <td th:text="${carData.getAdc2()}"></td>
        <td th:text="${carData.getAdc3()}"></td>
        <td th:text="${carData.getDecentering()}"></td>
        <td th:text="${carData.getAorc()}"></td>
        <td th:text="${carData.getLPwm()}"></td>
        <td th:text="${carData.getRPwm()}"></td>
        <td th:text="${carData.getXUnknow()}"></td>
        <td th:text="${carData.getYUnknow()}"></td>
        <td th:text="${carData.getZUnknow()}"></td>
        <td th:text="${carData.getCircle()}"></td>
    </tr>
    </tbody>
    </table>
</html>

